<template>
	<view class="agric-bottom">
		<template v-for="(item,index) in data">
			<view :key="index" :class="['item',{active:route==item.url}]" @click="handleSwitch(item,index)">
				<image class="img" :src="route==item.url?item.activeIcon:item.icon" mode=""></image>
				<text>{{item.label}}</text>
			</view>
		</template>
	</view>
</template>

<script>
	export default {
		name:"customTabbar",
		data() {
			return {
				tabIndex:0,
				route:'',
				data:[
					{
						label:'产品信息',
						icon:'https://nmlwx.sowreap.cn/nongmuWeChatImage/static/images/trace/bottom-1.png',
						activeIcon:'https://nmlwx.sowreap.cn/nongmuWeChatImage/static/images/trace/bottom-1a.png',
						url:'/pages/agricTrace/agricInfo/agricInfo'
					},
					{
						label:'生长环境',
						icon:'https://nmlwx.sowreap.cn/nongmuWeChatImage/static/images/trace/bottom-2.png',
						activeIcon:'https://nmlwx.sowreap.cn/nongmuWeChatImage/static/images/trace/bottom-2a.png',
						url:'/pages/agricTrace/growEnv/growEnv'
					},
					{
						label:'生长日记',
						icon:'https://nmlwx.sowreap.cn/nongmuWeChatImage/static/images/trace/bottom-3.png',
						activeIcon:'https://nmlwx.sowreap.cn/nongmuWeChatImage/static/images/trace/bottom-3a.png',
						url:'/pages/agricTrace/growDiary/growDiary'
					},
					{
						label:'权威监管',
						icon:'https://nmlwx.sowreap.cn/nongmuWeChatImage/static/images/trace/bottom-4.png',
						activeIcon:'https://nmlwx.sowreap.cn/nongmuWeChatImage/static/images/trace/bottom-4a.png',
						url:'/pages/agricTrace/authority/authority'
					},
				]
			};
		},
		// props:{
		// 	tabIndex:{
		// 		type:Number,
		// 		default:0
		// 	}
		// },
		methods:{
			handleSwitch(item,index,$event){
				console.log(111,item)
				// uni.$emit('handleSwitch',item,index)
				// this.tabIndex=index;
				// console.log(item)
				uni.redirectTo({
					url:item.url
				})
			}
		},
		mounted(){
			var pages = getCurrentPages();
			this.route= '/'+pages[pages.length-1].route
			console.log(this.route)
			console.log(pages)
			
		}
	}
</script>

<style scoped lang="scss">
.agric-bottom{
	position: fixed;
	background:#fff;
	left:0;
	bottom:0;
	height: 110rpx;
	width:750rpx;
	display: flex;
	align-items: center;
	justify-content: space-around;
	.item{
		display: flex;
		align-items: center;
		justify-content: space-around;
		flex-direction: column;
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #999999;
		.img{
			width: 44rpx;
			height: 44rpx;
			margin-bottom: 10rpx;
		}
		&.active{
			color:#07C160
		}
	}
}
</style>